<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <script>
        var name='端总';//是挂载 window上  window.name
        let zw={
            name:'紫薇',
            sex:'仙女',
            famil:'紫禁城'

        }
        let xz={
            name:'翔总',
            // getName:function(){}
            getName(){
               console.log(this.name);
            }
        }
       
        // this是一个关键词  在函数被 运行的时候 被动态的创建出来
        //this 是被动态决定的
        //    1. xz.getName();被运行时，运行方式 是对象的方法被调用
        //    this 指向对象
        //    2. 函数作为事件响应函数的形式被调用，this指向事件对象

        xz.getName(); 
       // fn 代码体 getName一样，但是运行方式不一样
        // fn 普通函数运行时，this指向全局
        const fn=xz.getName;
        console.log(fn);//this 丢失了
        fn('-----------');


        const fn2=fn.bind(zw);
        // this 可以被手动绑定 
        console.log(fn2);
        fn2();
    </script>
</body>
</html>